.fixed-modal{
    z-index: 1;
    position: fixed;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    left: 0;
    transition: 0.6s @standard-curve top; 
    &.slide-up{
        top:0;
    }
    &.slide-down{
        top:100vh;
    }
}

.scale-back{
    transform: scale(0.9,0.9);
    overflow: hidden;  
}
#warp{
    transition: 0.5s @standard-curve all; 
}
body{
    &:after{
        content:'';
        position: fixed;
        display: block;
        width: 100%;
        height: 100%;
        top:0;
        z-index: -1;
        background-color: rgba(0, 0, 0, 0);
        transition: 0.3s @standard-curve background-color; 
    }
    &.mask{
        &:after{
            z-index: 0;
            background-color: rgba(0, 0, 0, 0.5);
        }
    }
}

.modal-body{
    position: relative;
    .full-wh;
    overflow: auto;
    text-align: center;
}
#viewer{
    &:hover{
        cursor: zoom-out;
    }
    &.zoomed{
        max-width: 90%;
        &:hover{
            cursor: zoom-in;
        }
    }
}


// scroll area
